
<html>
<head>

    <script type="text/javascript" src="/jquery/jquery.js"></script>
    <script type='text/javascript' src='/jquery/jquery.bgiframe.min.js'></script>
    <script type='text/javascript' src='/jquery/jquery.ajaxQueue.js'></script>
    <script type='text/javascript' src='/jquery/jquery.autocomplete.js'></script>
    <link rel="stylesheet" type="text/css" href="/jquery/jquery.autocomplete.css" />

    <link rel="search" type="application/opensearchdescription+xml" title="OpenSearchDemo" href="/opensearch.xml">
    
    <script type="text/javascript">
        function form_setfocus()
        {
            document.myform.search_term.focus();
        }
    </script>
<STYLE TYPE="text/css">

<!--
body {
    font-family: verdana;
}
pre {
    background-color: lightgrey;
    border: 1px solid #5096B9;
    padding: 10 10 10 10;
}
h1 {
    background-color: #5096B9;
    color: white;
    padding: 10 10 10 10;
    text-align: center;
}
h2 {
    color: #5096B9;
}
h3 {
    color: #5096B9;
}
h4 {
    color: #5096B9;
}
h5 {
    color: #5096B9;
}
h6 {
    color: #5096B9;
}
span.error {
    color: #ff0000;
}
label.required {
    color: #0000ff;
}
#grepoptions {
    margin: 0px 20px 0px 20px;
    display: block;
    background-color: #ECE9D8;
    border: 1px solid #333333;
}
-->

</STYLE>

<script type="text/javascript">
$(function() 
{
    function format_opensearch(instr)
    {
        // format the "data" attribute from a single parsed (by parse_opensearch) result
        if (instr.description)
            return instr.suggested_word + " - " + instr.description;
        else
            return instr.suggested_word;
    }
    function parse_opensearch(data)
    {
        // Parse OpenSearch json results as defined in http://www.opensearch.org/Specifications/OpenSearch/Extensions/Suggestions/1.0
        data = eval(data); // todo this isn't safe! Ideally have SafeJsonEval()
        var parsed = [];

        for (var i=0; i < data[1].length; i++)
        {
            var suggested_word = jQuery.trim(data[1][i]);
            var desc = null;
            if (data.length >=3)
            {
                // looks like we have the (optional) description
                desc = jQuery.trim(data[2][i]);
            }
            if (suggested_word)
            {
                tempdict={'suggested_word':suggested_word, 'description':desc};
                parsed[parsed.length] = {
                    data: tempdict,
                    value: suggested_word,
                    result: suggested_word // actual autocomplete text to use (if selected)
                };
            }
        }
        return parsed;
    }

    var opensearch_autocomplete_on = 1;
    if (opensearch_autocomplete_on)
    {
        $("#search_term").autocomplete('jquery_suggest',
            {
                multiple: true,
                multipleSeparator: ' ',
                parse: parse_opensearch,
                formatItem: format_opensearch
            }
        );
    }
}
);
</script>

</head>


<body onload="form_setfocus()">

    <h1>OpenSearch Demo</h1>
    <p>This is a demo of a Python server that supports OpenSearch 1.1 along with a javascript client that can use the OpenSearch suggestion interface in forms.
    </p>
    
    <p>OpenSearch is used in many browser to support Search Engine Plugins. Using a Javascript client to access an OpenSearch interface means applications only need to implement a single suggestion interface
    </p>
    
    <p>Useful links for OpenSearch
    <li><a href="http://developer.mozilla.org/en/Creating_OpenSearch_plugins_for_Firefox">Creating OpenSearch plugins for Firefox</a> for a good starting web page (it has links to the OpenSearch specification)</li>
    <li><a href="http://code.google.com/p/gsa-open-search-via-opensearch/">Using OpenSearch</a> Focused on Google Search Appliances but is a great resource on how to use OpenSearch services in popular browsers</li>
    </p>
    
    <p>
    </p>
    
    
    Try entering in text, if using static demo, enter "a" (lower case letter A) ONLY and then pause, then pick a word.
    Then try "f". the static demo only supports words beggining with "a" and "f" (either lower or upper case).
    <form action="" method="get" id="myform"
     name="myform">
      <table border="0" cellpadding="0" cellspacing="0">
        <tbody>
          <tr>
            <td><label>search_term</label></td>
            <td><input id="search_term" name="search_term" maxlength="2048" size="55" value="" type="text"></td>
          </tr>
        </tbody>
      </table>
      <input value="Search" type="submit">
    </form>

</body>
</html>
